<template>
	<view style="background-color: #f1f1f1;height: 100vh;">
		<view class="top">
			<view class="topOne">
				<view class="topOne-left">
					<text>基础信息</text>
				</view>
				<view class="topOne-right">
					<text>设备编号：{{dataList.YDVNUM}}</text>
				</view>
			</view>
			<view class="two">
				<view class="two-one">
					<view class="two-oneLeft" style="width: 190rpx;">设备名称 :</view>
					<view class="two-oneRight" style="width: 500rpx;">{{dataList.YDENAM}}</view>
				</view>
				<view class="two-one">
					<view class="two-oneLeft" style="width: 190rpx;">上次点检 :</view>
					<view class="two-oneRight" style="width: 500rpx;">{{dataList.YCHKDAT}}</view>
				</view>
				<view class="two-one">
					<view class="two-oneLeft" style="width: 190rpx;">上次点检人 :</view>
					<view class="two-oneRight" style="width: 500rpx;">{{dataList.YCHKUSR}}</view>
				</view>
			</view>
		</view>
		<br>
		<view class="top">
			<view class="topOne">
				<view class="topOne-left">
					<text>点检项目</text>
				</view>
				<view class="topOne-right">
					<text>{{new Date().toLocaleDateString()}}</text>
				</view>
			</view>
			<view class="two">
				<view class="two-one" v-for="(item,index) in dataList2">
					<view class="two-oneLeft">{{item.YDJXMU}} :</view>
					<view class="two-oneRight">						
						<!-- <checkbox-group  style="heigth:10px"
						@change="val => checkboxChange(val,index)">
							<label heigth="0">
								<checkbox  
									:checked="item.value" style="transform:scale(0.7)"/>
							</label>
						</checkbox-group> -->
					</view>
					<view class="dxRadio">
						<u-radio-group
						    v-model="radiovalue1[index]"
							placement="row"
						    @change="val => groupChange(val,index)"
							:disabled="disabled"
						  >
						    <u-radio
						      :customStyle="{marginBottom: '8px'}"
						      v-for="(item, index1) in radiolist1"
						      :key="index1"
						      :label="item.name"
						      :name="item.name"
						      @change="val => radioChange(val,index)"
						    >
						    </u-radio>
						  </u-radio-group>
					</view>
				</view>
				<view v-if="disabled==false">
				<view class="labelBox">
					<u-form-item label="备注" labelWidth="100rpx" prop="bz" >
					</u-form-item>
				</view>
				<view class="photoBox">
					 <u--input
					    placeholder="请输入备注"
					    border="surround"
					    v-model="valueBz"
					    @change="change"
					  ></u--input>
				</view>
				</view>
				<view class="labelBox">
					<u-form-item label="拍照" labelWidth="100rpx" prop="photo" >
					</u-form-item>
				</view>
				<view class="photoBox">
					<u-upload
						:fileList="fileList1"
						@afterRead="afterRead"
						@delete="deletePic"
						name="1"
						multiple
						:maxCount="10"
						accept="image"
						:capture="capture"
						v-if="disabled==false"
					>
					</u-upload>
					<u-album :urls="urls" v-if="disabled==true"></u-album>
				</view>
			</view>
		</view>
		<view class="jlBox">
			<view class="btnBox">
				<view class="btnBox-right">
					<u-button class="rgzxBox-btn2" type="primary" 
						style="margin-left: 180rpx;margin-top: -100rpx;"
						@click="okBtn" v-if="disabled==false">提交</u-button>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				capture: ['camera'],
				userInfo: {},
				show:false,
				title:'确认撤销',
				content:'您确定要撤销此单子吗？',
				cdData:{},
				dh:'',
				dataList: {},
				dataList2: [],
				num:'',
				fileList1: [],		
				valueBz: '',
				bzInput:'',
				radiolist1: [{
				            "name": "正常",
				            "a": "1",
				            value: false
				          },
				           {
				            "name": "异常",
							"a": "2",
				            value: false
				            }
				          ],
				radiovalue1: [],
				isClick: false,
				disabled:false,
				urls:[],
			}
		},
		onLoad(query) {
			this.num = query.num || 'KXS-158-23';
			console.log('onLoad')
			const value = uni.getStorageSync('userInfo')
			console.log(value);
			if (value) {
				this.userInfo = value
				console.log(this.userInfo);
			}else{
				console.log('未登录');
			}
			this.init()
		},
		methods: {
			change(e) {
				this.bzInput = e
				console.log(this.bzInput, '备注内容');
			},
			checkboxChange(e,index){
				console.log(e.detail.value,'++++',index);
				if(e.detail.value.length){
					this.dataList2[index].value = true
				}else{
					this.dataList2[index].value = false
				}
			},
			init(){
				let GRP1 = {
						GRP1: [{
							YDVNUM: this.num
						}]
				}
				let GRP1Json = JSON.stringify(GRP1)
				// console.log(GRP1Json);
				uni.request({
				  url: 'http://125.64.76.148:8125/KXJDX3Api/x3api', // 替换为实际的接口URL
				  method: 'POST', 
				  data: {
					"username":"APIUSER",
					"passwd":"123",
					"publicName":"WSLISTXDV",
					"method":"run",
					"test":uni.getStorageSync('test') ? "true" : "false",
					"inputXml":JSON.stringify(GRP1)
				  },
				  success: (res) => {
					// 请求成功的处理逻辑
					let resR1 = JSON.parse(res.data.message)
					this.dataList= resR1.GRP1[0] 
					console.log(this.dataList,'新报修数据');
					if(this.dataList.YCHKDAT!=null){
						var dat = this.dataList.YCHKDAT
						this.dataList.YCHKDAT = dat.slice(0,4)+'-'+dat.slice(4,6)+'-'+dat.slice(6,8)
					}
					this.dataList2=[]
					let grp2 = resR1.GRP2
					for (var i = 0; i < grp2.length; i++) {
						this.dataList2.push({
							YDJXMU:grp2[i].YDJXMU,
							YISYC:grp2[i].YISYC+"",
						})
						if(grp2[i].YISYC!=0){
							this.disabled=true
							this.radiovalue1.push(grp2[i].YISYC==2 ? '异常' : '正常')
						}
					}
					var files = resR1.GRP3
					for (var i = 0; i < files.length; i++) {
						this.urls.push(files[i].URL)
					}
					this.dataList.files=resR1.GRP3
				  },
				  fail: (err) => {
					// 请求失败的处理逻辑
					console.error(err);
				  }
				});
			},
			groupChange(n,index) {
				console.log('groupChange',n,index,this.radiovalue1)
					if(n=='异常'){
						this.dataList2[index].YISYC = "2"
					}else{
						this.dataList2[index].YISYC = "1"
					}
			      },
			radioChange(n,index) {
				console.log('radioChange',n,index,this.radiovalue1)
				if(n=='异常'){
					this.dataList2[index].YISYC = "2"
				}else{
					this.dataList2[index].YISYC = "1"
				}
			},
			okBtn(){
				console.log(JSON.stringify(this.dataList2))
				if(this.isClick){
					console.log('重复点击')
					return
				}
				
					var djmx = this.dataList2
					if(djmx.length==0){
						uni.$u.toast('未找到点检项')
						return
					}
					if(djmx.find(item => item.YISYC==0)){
						uni.$u.toast('存在未点检的项次，请处理后重新提交')
						return
					}
					if(this.fileList1.length==0){
						uni.$u.toast('请上传照片')
						return
					}
					for (var i = 0; i < this.fileList1.length; i++) {
						if(this.fileList1[i].url==''){
							uni.$u.toast('存在上传失败的图片，请处理后重新提交')
							return
						}
						if(this.fileList1[i].url.slice(0,4)=='blob'){
							uni.$u.toast('图片上传中，请稍后重试')
							return
						}
					}
				this.isClick = true
						// uni.$u.toast('校验通过')
						let GRP1 = {}
						GRP1.GRP1=[]
						let GRP3 = {}
						GRP1.GRP3=[]
						// alert(this.fileList1)
						for (var i = 0; i < this.fileList1.length; i++) {
							GRP1.GRP1.push({
								YDVNUM: this.dataList.YDVNUM,
								USERNAME: this.userInfo.NAME,
								PHONE: this.userInfo.PHONE,
								URL:this.fileList1[i].url,
								YBEIZ:this.bzInput,
							})
							GRP1.GRP3 = (this.dataList2)
						}
						if(this.fileList1.length==0){
							GRP1.GRP1.push({
								YDVNUM: this.dataList.YDVNUM,
								USERNAME: this.userInfo.NAME,
								PHONE: this.userInfo.PHONE,
								YBEIZ:this.bzInput,
							})
							GRP1.GRP3 = (this.dataList2)
						}
						// alert(GRP1.GRP2)
						let GRP1Json = JSON.stringify(GRP1)
						// alert(GRP1Json)
						// console.log(GRP1Json);
						uni.request({
						  url: 'http://125.64.76.148:8125/KXJDX3Api/x3api'+"?_t="+new Date().getTime(), // 替换为实际的接口URL
						  method: 'POST', 
						  data: {
							"username":"APIUSER",
							"passwd":"123",
							"publicName":"WSGENYDJ",
							"method":"run",
							"test":uni.getStorageSync('test') ? "true" : "false",
							"inputXml":JSON.stringify(GRP1)
						  },
						  success: (res) => {
							  // alert(JSON.stringify(res))
							// 请求成功的处理逻辑
							if(res.data.status=="error"){
								alert(res.data.message);								
								this.isClick = false
								return false;
							}else{
								let resR = JSON.parse(res.data.message)
								console.log(resR,'resR');
								// console.log(resR.GRP1.WOK,56777);
								if(resR.GRP2.WOK==0){
									// 显示创建成功的消息提示
									uni.showToast({
									   title: '提交成功',
									   icon: 'success',
									   duration: 2000
									});																    this.bzInput=''
									let that = this
									setTimeout(function() {
										uni.redirectTo({url:"/pages/smbxPages/smbxPages"})
									}, 2000);
								}else{
									uni.showToast({
									   title: '提交失败',
									   icon: 'error',
									   duration: 2000
									});
								}
								this.isClick = false
							}
						  },
						  fail: (err) => {
							// 请求失败的处理逻辑
							console.error(err);
							alert('提交失败：'+JSON.stringify(err));
							this.isClick = false
						  }
						});
					
					// console.log(q.name);
			},
			// 删除图片
			deletePic(event) {
				this[`fileList${event.name}`].splice(event.index, 1)
			},
			// 新增图片
			async afterRead(event) {
				console.log('afterRead.1')
				console.log(this.fileList1[0])
				// 当设置 multiple 为 true 时, file 为数组格式，否则为对象格式
				let lists = [].concat(event.file)
				let fileListLen = this[`fileList${event.name}`].length
				lists.map((item) => {
					this[`fileList${event.name}`].push({
						...item,
						status: 'uploading',
						message: '上传中'
					})
				})
				for (let i = 0; i < lists.length; i++) {
					const result = await this.uploadFilePromise(lists[i].url)
					let item = this[`fileList${event.name}`][fileListLen]
					if(result==''){
						this[`fileList${event.name}`].splice(fileListLen, 1, Object.assign(item, {
							status: 'failed',
							message: '上传失败',
							url: ''
						}))
						fileListLen++
					}else{
						this[`fileList${event.name}`].splice(fileListLen, 1, Object.assign(item, {
							status: 'success',
							message: '',
							url: result
						}))
						fileListLen++
					}
					
				}
				console.log('afterRead.2')
				console.log(this.fileList1[0])
			},
			uploadFilePromise(url) {
				return new Promise((resolve, reject) => {
					let a = uni.uploadFile({
						url: 'http://125.64.76.148:8125/KXJDDDApi/file/upload', // 仅为示例，非真实的接口地址
						filePath: url,
						name: 'file',
						formData: {
							user: 'test'
						},
						success: (res) => {
							setTimeout(() => {
								console.log(res)
								resolve(JSON.parse(res.data).data)
							}, 1000)
						},
						fail:(err) => {
							console.log(err)
							resolve('')
						}
					});
				})
			},
		}
	}
</script>

<style>
.top{
	width: 90%;
	/* height: 350rpx; */
	background-color: white;
	position: relative;
	top: 50rpx;
	margin: 0 auto;
}
.topOne{
	height: 90rpx;
	border-bottom: 1px solid #ccc;
	display: flex;
	justify-content: space-between;
}
.topOne-left{
	width: 230rpx;
	font-weight: bold;
	font-size: 36rpx;
	text-align: center;
	padding-top: 20rpx;
}
.topOne-right{
	width: 400rpx;
	text-align: center;
	padding-top: 20rpx;
	color: gray;
	font-size: 28rpx;
}
.two{
	/* height: 300rpx; */
	background-color: white;
}
.two-one{
	/* height: 60rpx; */
	display: flex;
	justify-content: space-between;
}
.two-oneLeft{
	width: 500rpx;
	line-height: 68rpx;
	color: gray;
	text-align: right;
}
.two-oneRight{
	width: 200rpx;
	line-height: 68rpx;
	color: gray;
	text-align: center;
}
.dxRadio{
	width: 170rpx;
	margin-right: 120rpx;
    margin-top: 20rpx;
}
.two2{
	height: 250rpx;
	background-color: white;
}
.two2-one{
	height: 60rpx;
	display: flex;
	justify-content: space-between;
}
.two2-oneLeft{
	width: 190rpx;
	line-height: 68rpx;
	color: gray;
	text-align: center;
}
.two2-oneRight{
	width: 350rpx;
	line-height: 68rpx;
	color: gray;
	text-align: center;
}
.wxxx{
	width: 90%;
	/* height: 350rpx; */
	background-color: white;
	position: relative;
	top: 100rpx;
	margin: 0 auto;
}
.wxxxOne{
	height: 90rpx;
	border-bottom: 1px solid #ccc;
	display: flex;
	justify-content: space-between;
}
.wxxxOne-left{
	width: 230rpx;
	font-weight: bold;
	font-size: 36rpx;
	text-align: center;
	padding-top: 20rpx;
}
.ddlcjlBox{
	width: 90%;
	height: 250rpx;
	position: relative;
	top: 160rpx;
	margin: 0 auto;
	background-color: white;
}
.ddlcjlBox-top{
	height: 70rpx;
	color: gray;
	text-align: center;
	font-size: 38rpx;
	padding-top: 15rpx;
}
.ddlcjlBox-two{
	height: 50rpx;
	display: flex;
	justify-content: space-between;
	color: gray;
	padding-left: 15rpx;
}
.ddlcjlBox-twoLeft{ 
	width: 320rpx;
}
.ddlcjlBox-twoCenter{
	width: 100rpx;
}
.ddlcjlBox-twoRightr{
	width: 100rpx;
}
.bcjlBox{
    width: 90%;
	height: 70rpx;
	position: relative;
	top: 200rpx;
	margin: 0 auto;
	background-color: white;
	color: gray;
	font-size: 32rpx;
	padding-top: 20rpx;
	padding-left: 20rpx;
}
.jlBox{
	width: 90%;
	height: 00rpx;
	/* position: relative;
	top: 250rpx;
	margin: 0 auto; */
	background-color: white;
	font-size: 42rpx;
	padding-top: 0rpx;
	padding-left: 300rpx;
}
.btnBox{
	width: 100%;
	height: 80rpx;
	position: relative;
	top: 200rpx;
	left: -270rpx;
	display: flex;
	justify-content: space-between;
}
.btnBox-left{
	width: 350rpx;
	border-right: 1px solid #ccc;
}
.btnBox-right{
	width: 350rpx;
}
.labelBox{
	background-color: #f1f1f1;
	display: flex;
	justify-content: space-between;
}
</style>
